<template>
  <!-- 折线图 -->
  <div :style="myStyle"></div>
</template>

<script>
// import * as echarts from 'echarts'
import echarts from './index'
export default {
  props: {
    // 业务数据
    myData: {
      type: Object,
      default: () => {
        return {
          tooltip: {
            trigger: 'axis'
          },
          xAxis: {
            type: 'category',
            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
          },
          yAxis: {
            type: 'value'
          },
          series: [
            {
              data: [150, 230, 224, 218, 135, 147, 260],
              type: 'line'
            }
          ]
        };
      }
    },
    // 样式定制
    myStyle: {
      type: Object,
      default: () => {
        return {
          width: "440px",
          height: "260px"
        }
      }
    }
  },

  data() {
    return {
      option: ""
    }
  },
  mounted() {
    this.getLine()
  },
  methods: {
    getLine() {
      //   var chartDom = document.getElementById(this.$el)
      var myChart = echarts.init(this.$el)

      this.option = this.myData
      //设置值
      this.option && myChart.setOption(this.option);
    }
  }
}
</script>

<style></style>